<html>
<style>
html {
	font-size: 12px;
	color: white;
	text-shadow: .1rem 0rem .3rem blue,-.1rem 0rem .3rem blue,0rem .1rem .3rem blue,0rem -.1rem .3rem blue;
}
table {
	width: 100%;
	border:1px solid white;
	font-size: 12px;
}
td {
	text-align: center;
	border:1px solid white;
}
td:hover{
	background-color: black;
}
.position table{
	border: 0px;
}
.position td{
	border: 0px;
}
.timeline {
	margin-left: 10px;
}
</style>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<table id='p1' style="display:;">
	<tbody>
		<tr>
			<td colspan="2" style="width:100%;">P1</td>
		</tr>
		<tr>
			<td style="width:45%">
				<div class='position'>
					<table>
						<tr>
							<td colspan="3" style="width:100%">左右分组</td>
						</tr>
						<tr>
							<td style="width:50%">MT</td><td style="width:50%">ST</td>
 						</tr>
						<tr>
							<td style="width:50%">D1</td><td style="width:50%">D2</td>
 						</tr>
						<tr>
							<td style="width:50%">D3</td><td style="width:50%">D4</td>
 						</tr>
						<tr>
							<td style="width:50%">H1</td><td style="width:50%">H2</td>
 						</tr>
					</table>
				</div>
			</td>
			<td style="width:55%;text-align:left;">
				<div class="timeline">
					■ 怒潮咆哮（AOE）<br>
					■ 死刑（MT无敌）<br>
					■ 召唤水柱（左右）<br>
					■ 龙王喷水<br>
					■ 中间诱导+两侧分散<br>
					■ 龙王喷水<br>
					■ 巨漩涡<br>
					■ 2连俯冲<br>
					■ 怒潮咆哮（AOE）
				</div>
			</td>
		</tr>
		<tr>
			<td class="button" colspan="2" onclick="window.location.href='./Mainmenu.html'" style="width:100%">点击返回主菜单</td>
		</tr>
	</tbody>
</table>
<table id='p2' style="display:none;">
	<tbody>
		<tr>
			<td colspan="2" style="width:100%;">P2</td>
		</tr>
		<tr>
			<td style="width:45%">
				<div class='position'>
					<table>
						<tr>
							<td colspan="3" style="width:100%">左右分组</td>
						</tr>
						<tr>
							<td style="width:50%">MT</td><td style="width:50%">ST</td>
 						</tr>
						<tr>
							<td style="width:50%">D1</td><td style="width:50%">D2</td>
 						</tr>
						<tr>
							<td style="width:50%">D3</td><td style="width:50%">D4</td>
 						</tr>
						<tr>
							<td style="width:50%">H1</td><td style="width:50%">H2</td>
 						</tr>
					</table>
				</div>
			</td>
			<td style="width:55%;text-align:left;">
				<div class="timeline">
					■ 大海啸<br>
					■ 中间向前喷水<br>
					■ 左右分散<br>
					■ 龙王喷水+分摊<br>
					■ 死刑（ST无敌）<br>
					■ 龙王另一侧喷水<br>
					■ 怒潮咆哮（AOE）
				</div>
			</td>
		</tr>
	</tbody>
</table>
<table id='p3' style="display:none;">
	<tbody>
		<tr>
			<td colspan="2" style="width:100%;">P3</td>
		</tr>
		<tr>
			<td style="width:45%">
				<div class='position'>
					<table>
						<tr>
							<td colspan="3" style="width:100%">左右分组</td>
						</tr>
						<tr>
							<td style="width:50%">MT</td><td style="width:50%">ST</td>
 						</tr>
						<tr>
							<td style="width:50%">D1</td><td style="width:50%">D2</td>
 						</tr>
						<tr>
							<td style="width:50%">D3</td><td style="width:50%">D4</td>
 						</tr>
						<tr>
							<td style="width:50%">H1</td><td style="width:50%">H2</td>
 						</tr>
					</table>
				</div>
			</td>
			<td style="width:55%;text-align:left;">
				<div class="timeline">
					■ 水之觉醒<br>
					■ 怒潮肆虐（AOE）<br>
					■ 召唤水柱（左右）<br>
					■ 龙王2连喷水<br>
					■ 中间诱导+两侧分散<br>
					■ 龙王2连喷水
					■ 巨漩涡<br>
					■ 3连俯冲<br>
					■ 怒潮肆虐（AOE）<br>
					■ 死刑（MT左挑衅）<br>
					■ 龙王2连喷水<br>
					■ 中间诱导+两侧分散<br>
					■ 龙王2连喷水							
				</div>
			</td>
		</tr>
	</tbody>
</table>
<table id='p4' style="display:none;">
	<tbody>
		<tr>
			<td colspan="2" style="width:100%;">P4</td>
		</tr>
		<tr>
			<td style="width:45%">
				<div class='position'>
					<table>
						<tr>
							<td colspan="3" style="width:100%">左右分组</td>
						</tr>
						<tr>
							<td style="width:50%">MT</td><td style="width:50%">ST</td>
 						</tr>
						<tr>
							<td style="width:50%">D1</td><td style="width:50%">D2</td>
 						</tr>
						<tr>
							<td style="width:50%">D3</td><td style="width:50%">D4</td>
 						</tr>
						<tr>
							<td style="width:50%">H1</td><td style="width:50%">H2</td>
 						</tr>
					</table>
				</div>
			</td>
			<td style="width:55%;text-align:left;">
				<div class="timeline">
					■ 大暴风雨<br>
					■ 左前诱导5连AOE<br>
					■ 核爆坦克后方CD<br>
					■ 龙王2连喷水<br>
					■ 分摊5连喷水<br>
					■ 2连AOE<br>
					■ 中间诱导+外侧分散	
				</div>
			</td>
		</tr>
	</tbody>
</table>
<table id='p5' style="display:none;">
	<tbody>
		<tr>
			<td colspan="2" style="width:100%;">P5</td>
		</tr>
		<tr>
			<td style="width:45%">
				<div class='position'>
					<table>
						<tr>
							<td colspan="3" style="width:100%">左右分组</td>
						</tr>
						<tr>
							<td style="width:50%">MT</td><td style="width:50%">ST</td>
 						</tr>
						<tr>
							<td style="width:50%">扇H</td><td style="width:50%">扇D</td>
 						</tr>
						<tr>
							<td style="width:50%">分H</td><td style="width:50%">浪D</td>
 						</tr>
						<tr>
							<td style="width:50%">菊D</td><td style="width:50%">分D</td>
 						</tr>
					</table>
				</div>
			</td>
			<td style="width:55%;text-align:left;">
				<div class="timeline">
					■ 菊D最前方向后击退<br>
					■ 两侧分开 坦克去前<br>
					■ 浪D最前方向后击退<br>
					■ 圆T去后场角落<br>
					■ 浪T中场向前击退<br>
					■ 浪T向前 圆T爆炸<br>
					■ 龙王2连喷水<br>
					■ 2连AOE<br>
					■ 死刑（MT无敌）
				</div>
			</td>
		</tr>
	</tbody>
</table>
<table id='p6' style="display:none;">
	<tbody>
		<tr>
			<td colspan="2" style="width:100%;">P6</td>
		</tr>
		<tr>
			<td style="width:45%">
				<div class='position'>
					<table>
						<tr>
							<td colspan="3" style="width:100%">左右分组</td>
						</tr>
						<tr>
							<td style="width:50%">MT</td><td style="width:50%">ST</td>
 						</tr>
						<tr>
							<td style="width:50%">D1</td><td style="width:50%">D2</td>
 						</tr>
						<tr>
							<td style="width:50%">D3</td><td style="width:50%">D4</td>
 						</tr>
						<tr>
							<td style="width:50%">H1</td><td style="width:50%">H2</td>
 						</tr>
					</table>
				</div>
			</td>
			<td style="width:55%;text-align:left;">
				<div class="timeline">
					■ 中间诱导+两侧分组<br>
					■ T去后 他人前分摊<br>
					■ T去最前 远程后诱导<br>
					■ 坦克12连喷水<br>
					■ 远程诱导4塔<br>
					■ 龙王2连喷水<br>
					■ 2连AOE<br>
					■ 3连AOE+狂暴
				</div>
			</td>
		</tr>
	</tbody>
</table>
</body>
<script src="../resources/common.js"></script>
<script>
'use strict';

var stage = "p1";

addOverlayListener('onLogEvent', function(e) {
  for (let i = 0; i < e.detail.logs.length; i++) {
    if (e.detail.logs[i].match('\u4ece\u6d88\u5931\u7684\u6c34\u5e95\u800c\u6765')) {
		phase('p1');
		stage = "p1";
    } else if (stage === "p1" && e.detail.logs[i].match('\u5c55\u73b0\u4f60\u72c2\u66b4\u7684\u4e00\u9762\u5427')) {
		phase('p2');
		stage = "p2";
	} else if (stage === "p2" && e.detail.logs[i].match('\u89c9\u9192\u4e4b\u65f6\u6765\u4e34')) {
		phase('p3');
		stage = "p3";
	} else if (stage === "p3" && e.detail.logs[i].match('\u6d77\u6d6a\u4ece\u65e0\u505c\u6ede')) {
		phase('p4');
		stage = "p4";
	} else if (stage === "p4" && e.detail.logs[i].match('\u6f6e\u6da8\u6f6e\u843d\u4e43\u662f\u5927\u6d77')) {
		phase('p5');
		stage = "p5";
	} else if (stage === "p5" && e.detail.logs[i].match('\u5267\u70c8\u6ce2\u52a8')) {
		phase('p6');
		stage = "p6";
	} else if (e.detail.logs[i].match('40000012')) {
		phase('p1');
		stage = "p1";
	} else if (e.detail.logs[i].match('\u4efb\u52a1\u7ed3\u675f\u4e86')) {
		phase('p1');
		stage = "p1";
	}
  }
});

callOverlayHandler({ call: 'cactbotRequestState' });

function phase(p){
	document.getElementById("p1").style.display="none";
	document.getElementById("p2").style.display="none";
	document.getElementById("p3").style.display="none";
	document.getElementById("p4").style.display="none";
	document.getElementById("p5").style.display="none";
	document.getElementById("p6").style.display="none";
	document.getElementById(p).style.display="";
}
</script>
</html>
